<template>
	<a-transfer  
    v-model:target-keys="myTargetKeys"
    v-model:selected-keys="mySelectedKeys"
    v-bind="allAttrs" ref="zhTransferRef"
    :data-source="myData"
    :id="'zhTransfer' + columnId"
    :name="'zhTransfer' + columnId">
    <template #[item]="data" v-for="item in Object.keys($slots)">
			<slot :name="item" v-bind="data || {}"></slot>
		</template>
  </a-transfer>
</template>
<script lang="ts" setup name="zhTransfer">
//------------------接收传入参数(组件)-------------------
const props = defineProps({
	columnId: {
		// 字段ID、控件ID，用途非常广
		type: [Number, String],
		default: () => Math.floor(Math.random() * 1000000 + 1), // new Date().valueOf()
	},
  targetKeys: {
		type: Array,
		default: () => {
			return [];
		},
	},
  selectedKeys: {
		type: Array,
		default: () => {
			return [];
		},
	},
  funcCode:String,
  dataSource: {
		type: Array,
		default: () => {
			return [];
		},
	}
})
const attrs = useAttrs();
const allAttrs = computed(() => {
	return Object.assign(props.extend, attrs);
});
//------------------定义子组件---------------------------
const zhTransferRef=ref();
//------------------内部变量定义-------------------------
let myTargetKeys=ref<string[]>(props.targetKeys);
let mySelectedKeys=ref<string[]>(props.selectedKeys);
let myData = ref<any>(props.dataSource);
//let leftData = ref<>();
//let rightData = ref<>();
const emit = defineEmits(['update:targetKeys','update:selectedKeys']);
//------------------定义调用方法-------------------------

//------------------初始化------------------------------
onMounted(()=>{
})
//------------------监听------------------------------
watch(
	() => props.targetKeys,
	(val) => {
			myTargetKeys.value = val||[];
	},
	{
			immediate: true,
	}
);
watch(
	() => props.selectedKeys,
	(val) => {
			mySelectedKeys.value = val||[];
	},
	{
			immediate: true,
	}
);
watch(
	() => props.dataSource,
	(val) => {
			myData.value = val||[];
	},
	{
			immediate: true,
	}
);
watch(
	() => myTargetKeys.value,
	(val) => {
		emit('update:targetKeys', val||[]);
	},
	{
			immediate: true,
	}
);
watch(
	() => mySelectedKeys.value,
	(val) => {
		emit('update:selectedKeys', val||[]);
	},
	{
			immediate: true,
	}
);
//------------设置给父组件调用的数据/方法(组件)-----------

</script>
<style lang="scss" scoped></style>
